/*
 * @Description: 详情弹窗
 * @Author: Zzt
 * @Date: 2023-02-21 09:41:27
 * @LastEditTime: 2023-02-28 11:27:01
 */
import JPModal from '@/components/JPComponents/JPModal';
import { ICommonDialog } from '@/interfaces/global';
import { Button, Form } from 'antd';
import { useEffect } from 'react';
import { useAnnouncementMgtContext } from '../../contexts/AnnouncementMgtContext';
import AnnounceForm from './AnnounceForm';

interface IEditAnnounce extends ICommonDialog {
  data: any;
  disable: boolean;
  view: boolean;
}
const EditAnnounce = (props: IEditAnnounce) => {
  const { editAnnounce } = useAnnouncementMgtContext();
  const { onClose, visible, data, disable, view } = props;
  const [form] = Form.useForm();

  useEffect(() => {
    form.setFieldsValue({ ...data });
  }, [visible]);

  const onFinish = (values: any) => {
    // 调接口 {...data,values}
    editAnnounce({ ...data, ...values }).then(onClose());
    console.log('edit', { ...data, ...values });
  };
  return (
    <>
      <JPModal
        visible={visible}
        onCancel={onClose}
        title={disable ? '公告详情' : '公告编辑'}
        // draggable={true}
        width={600}
        footer={
          disable
            ? [
                <Button key={'close'} onClick={() => onClose()}>
                  关闭
                </Button>
              ]
            : [
                <Button key={'close'} onClick={() => onClose()}>
                  取消
                </Button>,
                <Button key={'submit'} type="primary" onClick={() => form.submit()}>
                  保存
                </Button>
              ]
        }
      >
        <Form
          form={form}
          labelCol={{ span: 4 }}
          onFinish={onFinish}
          wrapperCol={{ span: 20 }}
          disabled={disable}
        >
          <AnnounceForm data={data} view={view} />
        </Form>
      </JPModal>
    </>
  );
};
export default EditAnnounce;
